{% extends "admin/change_form.html" %}

{% block extrastyle %}
  {{ block.super }}

  <style type="text/css">
    .subdomain-text {
      fill: black !important;
    }
    .graph-label {
      fill: #2f2f2f !important;
    }

    .input-color  {
        height: 20px;
        display: inline-block;
        padding-left: 4px;
        padding-right: 5px;
    }

  </style>
{% endblock %}
{% block after_field_sets %}{{ block.super }}

<fieldset class="module aligned">
  <div class="form-row">
    <div>
      <label class="required">Sample occurrences</label>
      <div style="float: left">
        <div>
          <div class="input-color" style="background-color: #d6ffb0;">
              QC Window
          </div>
          <div class="input-color" style="background-color: #faea25;">
              Occurrence
          </div>
          <div class="input-color" style="background-color: #afd9ee;">
              Unscheduled
          </div>
        </div>
        <div class="hidden classic-freq">
          <p>
            <em>
              Classic Frequency:  Note since the QC window start is blank, this is
              a classic offset frequency and the dates shown below are only
              representative of the interval between due dates, not the actual due
              dates!
              See the <a href="http://docs.qatrackplus.com/en/latest/admin/qa/frequencies.html" target="_blank">Frequency Documentation</a>
              for more information.
            </em>
          </p>
        </div>

        <div id="cal-1"></div>
        <div id="cal-2"></div>
      </div>
  </div>
</fieldset>

<script type="text/javascript">

window.recurrenceUrl = "{% url 'qa_recurrences' %}";

</script>

{% endblock %}
